<template>
	<view class="page" v-if="checkPermission(['ROOT','MEETING:INSERT','MEETING:UPDATE'])">
		<view class="header">
			<input type="text" class="title" v-model="reason" placeholder="输入用车原因" placeholder-class="title-placeholder">
			<image src="https://www.retoc.xyz/icon/icon-18.png" mode="widthFix" class="edit-icon"></image>
		</view>
		<view class="attr">
			<view class="list">
				<view class="item">
					<view class="key">
						开始日期
					</view>
					<picker v-if="canEdit" mode="date" :value="date" @change="startChange">
						<view class="uni-input">{{start}}</view>
					</picker>
				</view>
				<view class="item">
					<view class="key">
						开始时间
					</view>
					<picker v-if="canEdit" mode="time" :value="start" @change="startTimeChange">
						<view class="uni-input">{{startTime}}</view>
					</picker>
				</view>
				<view class="item">
					<view class="key">
						结束日期
					</view>
					<picker v-if="canEdit" mode="date" :value="date" @change="endChange">
						<view class="uni-input">{{end}}</view>
					</picker>
				</view>
				<view class="item">
					<view class="key">
						结束时间
					</view>
					<picker v-if="canEdit" mode="time" :value="end" @change="endTimeChange">
						<view class="uni-input">{{endTime}}</view>
					</picker>
				</view>
				<view class="item">
					<view class="key">
						申请车型
					</view>
					<picker v-if="canEdit" :range="typeArray" :range-key="'name'" :value="typeIndex" @change="typeChange">
						{{typeArray[typeIndex].name}}
					</picker>
					<text v-if="!canEdit" class="value">{{typeArray[typeIndex].name}}</text>
				</view>
				<view class="item">
					<view class="key">
						车型
					</view>
					<view class="uni-input">{{typeArray[typeIndex].description}}</view>
				</view>
				<view class="item">
					<view class="key">
						图片
					</view>
					<img :src="typeArray[typeIndex].photo" alt="" class="img">
				</view>
				<view class="item">
					<view class="key">
						是否需要司机
					</view>
					<switch type="checkbox" :checked="driver" @change="needDriver"></switch>
				</view>
			</view>
			
		</view>

		<button class="btn" @tap="save">保存</button>
		
		<uni-popup ref="popupDesc" type="dialog">
			<uni-popup-dialog mode="input" title="输入用车原因" placeholder="输入用车原因" :value="reason" @confirm="finishDesc">
			</uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue';
	import uniPopupMessage from '@/components/uni-popup/uni-popup-message.vue';
	import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue';
	export default {
		components: {
			uniPopup,
			uniPopupMessage,
			uniPopupDialog
		},
		data() {
			return {
				opt: null,
				id: null,
				uuid: null,
				canEdit: true,
				end: "",
				start: '',
				startTime:"08:30",
				endTime: '18:00',
				typeArray: [],
				typeIndex: 1,
				reason: '',
				instanceId: null,
				carId:1,
				driver:false
			};
		},
		onShow() {
			let that = this
			let pages = getCurrentPages()
			let currPage = pages[pages.length - 1]
			that.ajax(that.url.searchCar, 'GET', null , function(resp) {
				let result = resp.data.result;
				console.log("CAR",result);
				that.typeArray=result
				that.carId=result[that.typeIndex].id
			});
			if (that.opt == 'insert') {
				let now = new Date()
				now.setTime(now.getTime() + 24 * 60 * 60 * 1000)
				that.start = now.format("yyyy-MM-dd")
				that.end = now.format("yyyy-MM-dd")
				that.endTime=now.format("hh:mm")
				that.startTime=now.format("hh:mm")
			} else if (that.opt == 'edit') {
				// console.log('meet.id', that.id);
				//获取数据
				that.ajax(that.url.selectCarUseById, 'POST', {
					id: that.id
				}, function(resp) {
					let result = resp.data.result;
					console.log("edit",result);
					for(let i=0;i<that.typeArray.length;i++){
						if(result.car_id==that.typeArray[i].id){
							that.typeIndex=i
							break
						}
					}
					that.uuid = result.uuid;
					let syear=new Date(result.start).getFullYear()
					let smonth=new Date(result.start).getMonth()+1
					let sday=new Date(result.start).getDate()
					let shour=new Date(result.start).getHours()
					let smin=new Date(result.start).getMinutes()
					let eyear=new Date(result.end).getFullYear()
					let emonth=new Date(result.end).getMonth()+1
					let eday=new Date(result.end).getDate()
					let ehour=new Date(result.end).getHours()
					let emin=new Date(result.end).getMinutes()
					console.log(syear+'-'+smonth+"-"+sday);
					that.startTime = shour+":"+(smin<10?"0"+smin:smin)
					// console.log(new Date(that.startTime).getMonth()+1);
					that.endTime = ehour+":"+(emin<10?"0"+emin:emin)
					that.start = syear+'-'+smonth+"-"+sday
					that.end = eyear+'-'+emonth+"-"+eday
					// that.typeIndex = result.type ;
					that.reason = result.reason;
					if (result.driver != null && result.driver != '') {
						that.driver = true;
					}
					that.instanceId = result.instanceId;
				});
			}
			
		},
		onLoad(options) {
			this.id = options.id;
			this.opt = options.opt;
		},
		methods: {
			startChange: function(e) {
				if (e.detail.value < Date.now()) {
					uni.showToast({
						icon: 'error',
						title: '时间已过期'
					})
					
					console.log(this.start);
					return
				}
				if (e.detail.value > this.end) {
					uni.showToast({
						icon: 'error',
						title: '不能晚于结束时间'
					})
					return
				}
				this.start = e.detail.value;
			},
			endChange: function(e) {
				if (e.detail.value < this.start) {
					uni.showToast({
						icon: 'error',
						title: '不能早于开始时间'
					})
					return
				}
				if(e.detail.value==this.start){
					if(this.endTime<this.startTime){
						uni.showToast({
							icon: 'error',
							title: '不能早于开始时间'
						})
						return
					}
				}
				this.end = e.detail.value;
			},
			startTimeChange: function(e) {
				if(this.start==this.end){
					if(e.detail.value<this.endTime){
						uni.showToast({
							icon: 'error',
							title: '不能晚于结束时间'
						})
						return
					}
				}
				this.startTime = e.detail.value;
			},
			endTimeChange: function(e) {
				if (this.start==this.end && e.detail.value < this.startTime) {
					uni.showToast({
						icon: 'error',
						title: '不能早于开始时间'
					})
					return
				}
				this.endTime = e.detail.value;
			},
			typeChange: function(e) {
				
				this.typeIndex = e.detail.value;
				this.carId=this.typeArray[e.detail.value].id
				console.log(this.carId);
			},
			
			// editDesc() {
			// 	if (!this.canEdit) {
			// 		return
			// 	}
			// 	this.$refs.popupDesc.open()
			// },
			// finishDesc(done, value) {
			// 	if (value != null && value != "") {
			// 		this.reason = value
			// 		done()
			// 	} else {
			// 		uni.showToast({
			// 			icon: 'error',
			// 			title: '内容不能为空'
			// 		})
			// 	}
			// },
			needDriver:function(e){
				this.driver=e.detail.value;
				console.log("driver",this.driver);
			},
			save: function() {
				let that = this;
				// let array = [];
				// for (let one of that.members) {
				// 	array.push(one.id);
				// }
				//验证数据
				if (
					that.checkBlank(that.reason, '用车原因') ||
					that.checkValidStartAndEnd(that.start, that.end)
				) {
					return;
				}
				let data = {
					reason: that.reason,
					startTime: that.start + " " + that.startTime+":00",
					endTime: that.end + " " + that.endTime+":00",
					carId: that.carId,
					// type: Number(that.typeIndex) + 1,
					// members: JSON.stringify(array),
					id: that.id,
					driver:that.driver
					// instanceId: that.instanceId
				};
				let url;
				if (that.opt == 'insert') {
					url = this.url.useCarRequest;
				} else if (that.opt == 'edit') {
					url = this.url.useCarUpdate;
				}
				that.ajax(url, 'POST', data, function(resp) {
					uni.showToast({
						icon: 'success',
						title: '保存成功',
						complete: function() {
							setTimeout(function() {
								uni.navigateBack({});
							}, 2000);
						}
					});
				});
			},
		}
	}
</script>

<style lang="less">
@import url("carUse.less");
</style>
